
$(function () {
    $.get('js/fujian.json', function (chinaJson) {
        echarts.registerMap('china1', chinaJson);
        map();
    });

    function map() {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('map_1'));

        var data = [
            { name: '福州市', value: 175 },
            { name: '厦门市', value: 175 },
            { name: '莆田市', value: 175 },
            { name: '三明市', value: 175 },
            { name: '泉州市', value: 175 },
            { name: '漳州市', value: 175 },
            { name: '南平市', value: 175 },
            { name: '龙岩市', value: 175 },
            { name: '宁德市', value: 175 },
            // 南平
            { name: '亲睦村', value: 20 },
            { name: '崇仁村', value: 14 },
            { name: '山坊村', value: 33 },
            { name: '新甸村', value: 24 },
            { name: '金坑村', value: 36 },
            { name: '坎头村', value: 47 },
            { name: '福峰村', value: 23 },
            { name: '宝珠村', value: 53 },
            { name: '巨口村', value: 22 },
            { name: '凤池村', value: 26 },
            { name: '下梅村', value: 25 },
            { name: '五夫村', value: 33 },
            { name: '后畲村', value: 26 },
            { name: '头林村', value: 16 },
            { name: '书坊村', value: 36 },
            { name: '郑魏村', value: 32 },
            { name: '建瓯徐墩镇伍石村', value: 48 },
            { name: '建瓯吉阳镇曹墩村', value: 31 },
            { name: '建瓯小桥镇阳泽村', value: 19 },
            { name: '建欧东游镇党城村', value: 20 },
            { name: '浦城富岭镇山路村', value: 26 },
            { name: '浦城官路镇渔梁村', value: 23 },
            { name: '浦城水北街镇观前村', value: 22 },
            { name: '浦城古楼乡洋溪村', value: 19 },
            { name: '松溪祖墩乡下店村', value: 26 },
            { name: '松溪郑墩镇梅口村', value: 33 },
            { name: '松溪河东乡大布村', value: 15 },
            { name: '政和杨源乡杨源村', value: 17 },
            { name: '政和镇前镇镇前村', value: 16 },
            { name: '政和星溪乡富美村', value: 23 },
            { name: '政和铁山镇凤林村', value: 19 },
            { name: '政和石屯镇石圳村', value: 31 },
            { name: '政和外屯乡洋后村', value: 22 },
            { name: '政和岭腰乡高山村', value: 26 },
            // 福州
            { name: '窗厦村', value: 33 },
            { name: '柳浪村', value: 42 },
            { name: '浦江村', value: 34 },
            { name: '后湾里', value: 46 },
            { name: '天竹村', value: 58 },
            { name: '福州连江县透堡镇杨厝街', value: 24 },
            { name: '周店村', value: 26 },
            { name: '后朋村', value: 46 },
            { name: '福州福清上迳镇梧岗村', value: 32 },
            { name: '福州福清江阴镇下石村', value: 62 },
            { name: '宏路街道金印村', value: 33 },
            { name: '渔溪镇双墩村', value: 38 },
            { name: '上迳镇上迳村', value: 41 },
            { name: '江阴镇南曹村', value: 18 },
            { name: '港头镇白玉村', value: 26 },
            { name: '新厝畲族钟氏祖厅建筑群', value: 19 },
            { name: '江阴镇高岭村', value: 21 },
            { name: '新厝镇咳灶村', value: 19 },
            { name: '港头镇前林村', value: 22 },
            { name: '福建省福清市玉屏参府', value: 33 },
            { name: '福建省福清市宏路街道新仓村', value: 30 },
            // 宁德
            { name: '焦南街道', value: 33 },
            { name: '焦北街道', value: 38 },
            { name: '城南镇', value: 25 },
            { name: '漳湾镇', value: 41 },
            { name: '七都镇', value: 16 },
            { name: '赤溪镇', value: 18 },
            { name: '金涵畲族乡', value: 25 },
            { name: '洪口乡', value: 27 },
            { name: '霍童镇', value: 26 },
            { name: '洋中镇', value: 15 },
            { name: '飞鸾镇', value: 31 },
            { name: '石后乡', value: 19 },
            // 漳州
            { name: '石码街道', value: 38 },
            { name: '海澄镇', value: 25 },
            { name: '角美镇', value: 41 },
            { name: '浮宫镇', value: 16 },
            { name: '东泗乡', value: 18 },
            { name: '东园镇', value: 25 },
            { name: '紫泥镇', value: 27 },
            // 莆田
            { name: '西天尾镇', value: 138 },
            { name: '黄石镇', value: 75 },
            { name: '新度镇', value: 141 },
            { name: '北高镇', value: 80 },
            { name: '镇海街道', value: 65 },
            { name: '拱辰街道', value: 95 },
            { name: '萝苜田', value: 38 },
            // 三明
            { name: '凤岗街道', value: 48 },
            { name: '青州镇', value: 25 },
            { name: '夏茂镇', value: 11 },
            { name: '虬江街道', value: 26 },
            { name: '高砂镇', value: 65 },
            { name: '高桥镇', value: 95 },
            { name: '富口镇', value: 27 },
            { name: '大洛镇', value: 26 },
            { name: '南阳乡', value: 15 },
            { name: '南霞乡', value: 31 },
            { name: '湖源乡', value: 19 },
            // 龙岩
            { name: '凤城街道', value: 39 },
            { name: '坎市镇', value: 15 },
            { name: '培丰镇', value: 27 },
            { name: '龙潭镇', value: 16 },
            { name: '峰市镇', value: 23 },
            { name: '城郊乡', value: 31 },
            // 泉州
            { name: '五店历史街区', value: 39 },
            { name: '桃城镇', value: 39 },
            { name: '蓬壶镇', value: 15 },
            { name: '一都镇', value: 64 },
            { name: '石鼓镇', value: 51 },
        ]
        var geoCoordMap = {
            '福州市': [119.2978134, 26.07859039],
            '厦门市': [118.4175168, 24.45743561],
            '莆田市': [119.0103226, 25.43813705],
            '三明市': [117.6012268, 26.22301292],
            '泉州市': [118.5896378, 24.91591835],
            '漳州市': [117.6530914, 24.21816368],
            '南平市': [118.1691208, 26.64484215],
            '龙岩市': [117.0303879, 25.10970306],
            '宁德市': [119.5183182, 26.6664772],
            // 南平
            '亲睦村': [117.15258, 27.488573],
            '崇仁村': [117.345932, 27.609182],
            '新甸村': [117.50131, 27.82290],
            '金坑村': [117.19911, 27.25577],
            '福峰村': [117.72222, 26.76201],
            '巨口村': [118.54417, 26.50307],
            '下梅村': [118.05280, 27.67333],
            '后畲村': [118.25143, 27.54851],
            '头林村': [117.96929, 27.42729],
            '书坊村': [117.83943, 27.30262],
            // 福州
            '窗厦村': [119.22836, 25.93631],
            '浦江村': [119.61284, 26.21351],
            '后湾里': [119.57330, 26.34985],
            '周店村': [119.32470, 25.67862],
            '后朋村': [119.32607, 25.55768],
            // 宁德
            '七都镇': [119.55767, 26.79464],
            '赤溪镇': [119.49145, 27.01266],
            '洪口乡': [119.0, 26.88532],
            '洋中镇': [118.8, 26.71094],
            '飞鸾镇': [119.60541, 26.51948],
            // 漳州
            '海澄镇': [117.26206, 24.41838],
            '角美镇': [117.90684, 24.54196],
            '东泗乡': [117.78588, 24.36744],
            // 莆田
            '黄石镇': [119.28665, 25.18549],
            '北高镇': [119.07487, 25.29622],
            '萝苜田': [118.80217, 25.55537],
            // 三明
            '青州镇': [117.99079, 26.46298],
            '夏茂镇': [117.50608, 26.57733],
            '南阳乡': [117.97909, 26.33969],
            '湖源乡': [117.78113, 26.03067],
            // 龙岩
            '凤城街道': [116.72088, 24.71928],
            '坎市镇': [116.89765, 24.97318],
            '龙潭镇': [117.02108, 24.85308],
            // 泉州
            '五店历史街区': [118.59483 , 25.03101 ],
            // '桃城镇': [118.30877 , 25.32649],
            '蓬壶镇': [118.16888 , 25.31835],
            '一都镇': [117.81660 , 25.46020],
            '石鼓镇': [118.25911 , 25.14066],
        }

        var convertData = function (data) {
            var res = [];
            for (var i = 0; i < data.length; i++) {
                var geoCoord = geoCoordMap[data[i].name];
                if (geoCoord) {
                    res.push({
                        name: data[i].name,
                        value: geoCoord.concat(data[i].value)
                    });
                }
            }
            return res;
        };

        option = {
            // backgroundColor: '#404a59',
            /***  title: {
                  text: '实时行驶车辆',
                  subtext: 'data from PM25.in',
                  sublink: 'http://www.pm25.in',
                  left: 'center',
                  textStyle: {
                      color: '#fff'
                  }
              },**/
            tooltip: {
                trigger: 'item',
                formatter: function (params) {
                    if (typeof (params.value)[2] == "undefined") {
                        return params.name + ' : ' + params.value;
                    } else {
                        return params.name + ' : ' + params.value[2];
                    }
                }
            },

            geo: {
                map: 'china1',
                label: {
                    emphasis: {
                        show: false
                    }
                },
                roam: false,//禁止其放大缩小
                itemStyle: {
                    normal: {
                        areaColor: '#4c60ff',
                        borderColor: '#002097'
                    },
                    emphasis: {
                        areaColor: '#293fff'
                    }
                },
                zoom: 1.2
            },
            series: [
                // {
                //     name: '测绘数量',
                //     type: 'scatter',
                //     coordinateSystem: 'geo',
                //     data: convertData(data),
                //     symbolSize: function (val) {
                //         return val[2] / 40;
                //     },
                //     label: {
                //         normal: {
                //             formatter: '{b}',
                //             position: 'right',
                //             show: false
                //         },
                //         emphasis: {
                //             show: true
                //         }
                //     },
                //     itemStyle: {
                //         normal: {
                //             color: '#ffeb7b'
                //         }
                //     }
                // },
                {
                    name: 'Top 5',
                    type: 'effectScatter',
                    coordinateSystem: 'geo',
                    // data: convertData(data.sort(function (a, b) {
                    //     return b.value - a.value;
                    // }).slice(0, 6)),
                    data: convertData(data),
                    symbolSize: function (val) {
                        return val[2] / 50;
                    },
                    showEffectOn: 'render',
                    rippleEffect: {
                        brushType: 'stroke'
                    },
                    hoverAnimation: true,
                    label: {
                        normal: {
                            formatter: '{b}',
                            position: 'right',
                            show: true
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: '#ffeb7b',
                            shadowBlur: 10,
                            shadowColor: 'rgba(0,0,0,.3)'
                        }
                    },
                    zlevel: 1
                }
            ]
            //     /**
            //     ,
            //     {
            //         name: 'Top 5',
            //         type: 'effectScatter',
            //         coordinateSystem: 'geo',
            //         data: convertData(data.sort(function (a, b) {
            //             return b.value - a.value;
            //         }).slice(0, 6)),
            //         symbolSize: function (val) {
            //             return val[2] / 20;
            //         },
            //         showEffectOn: 'render',
            //         rippleEffect: {
            //             brushType: 'stroke'
            //         },
            //         hoverAnimation: true,
            //         label: {
            //             normal: {
            //                 formatter: '{b}',
            //                 position: 'right',
            //                 show: true
            //             }
            //         },
            //         itemStyle: {
            //             normal: {
            //                 color: '#ffd800',
            //                 shadowBlur: 10,
            //                 shadowColor: 'rgba(0,0,0,.3)'
            //             }
            //         },
            //         zlevel: 1
            //     }
            //     **/
            // ]
        };

        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    }
})

